<template>
<div class="edit-box">
  <div>
    <div class="body-list">
      <HeaderCom></HeaderCom>
      <TitleList></TitleList>
    </div>
  </div>
  <div>
    <router-view/>
  </div>
</div>
</template>

<script>
  import HeaderCom from './Header.vue';
  import TitleList from './TitleList.vue'
    export default {
        name: 'Edit',
        data (){
            return {

            }
        },
        components:{
            'HeaderCom':HeaderCom,
            'TitleList':TitleList
        }
    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
.edit-box{
  display: flex;
  padding-top: 100px;
  >div:nth-of-type(1){
    flex: 1;
    .body-list{
      border-right: 1px dashed #d1d1d1;
      padding: 0 20px 0 20px;
    }
  }
  >div:nth-of-type(2){
    flex: 2;
  }
}
</style>
